@extends('admin.layouts.app')
@section('css')

 
@endsection
@section('content')       



                        <!-- Page-Title -->
                        <div class="row">
                            <div class="col-sm-12">
                                

                              
                                <ol class="breadcrumb">
                                    <li><a href="{{url('zadmin')}}">塔台</a></li>
                                    <li><a href="{{url('zadmin/products')}}">相册管理</a></li>
                                    
                                </ol>
                            </div>
                        </div>
                 
                

                      <div class="row port">
                            <div class="portfolioContainer">
                              <div class="col-md-1">
                              <div class="gal-detail thumb">
        <img src="{{ asset('assets/images/upload.png')}}" alt="work-thumbnail" class="thumb-img" id="pickfiles" />
                              
                              </div>
                              </div>
                      @foreach($list as $v)  
                       
                                <div class="col-sm-2 col-lg-2 col-md-2 webdesign illustrator">
                                    <div class="gal-detail thumb">
                                        <a href="{{$OSS.$v->imgurl}}" class="image-popup" title="Screenshot-1" target="_blank">
                              <img src="{{$OSS.$v->imgurl}}" class="thumb-img" height="150"  >
                                        </a>
                                        <a class="btn btn-sm btn-danger m-t-10" href="{{url('zadmin/product-imgs',$v->id)}}" data-method="delete" 
  data-token="{{csrf_token()}}" data-confirm="确定删除吗?">
<span class="btn-label">
  <i class="md md-close"></i>
</span>删除</a>
                                    </div>
                                </div>
                        @endforeach        
                                

                                
                                
                                

                            </div>
                        </div> <!-- End row -->
                        </div>
@endsection
@section('js')                   
 <script type="text/javascript" src="/js/plupload.full.min.js"></script>
      
        <script type="text/javascript">
          var product_id = "{{$product->id}}";
          var OSS = "{{env('OSS_URL')}}";
          
          var pics = '';
          var uploader = new plupload.Uploader({
              runtimes : 'html5,flash,silverlight,html4',
              browse_button : 'pickfiles',               
              url : "{{url('zadmin/img-upload')}}",
              flash_swf_url : '../js/Moxie.swf',
              silverlight_xap_url : '../js/Moxie.xap',
              headers: {
                  'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
              },
              filters : {
                max_file_size : '10mb',
                mime_types: [
                  {title : "Image files", extensions : "jpg,gif,png"},
                  {title : "Zip files", extensions : "zip"}
                ]
              },

              init: {
                PostInit: function() {
                  

                  
                },

                BeforeUpload:function(up,file){
                  uploader.setOption("multipart_params",{
                    "product_id":product_id
                  });
                },


                FilesAdded: function(up, files) {

                  plupload.each(files, function(file) {
                   
                     uploader.start();
                     return false;
                  });
                },

               

                 FileUploaded: function(up, file, info) {
                    // Called when file has finished uploading
                    var json =  JSON.parse(info.response);
                    var rs = json.result;
                    if(rs.status){
                      addImg(OSS+rs.data,rs.img_id);
                     
                      
                     
                    }
                    console.info(rs);                              
                },
              }
          });
      uploader.init();

    function addImg(imgurl,img_id) {
      var delUrl = "{{url('zadmin/product-imgs')}}/"+img_id;
      var html = '<div class="col-sm-2 col-lg-2 col-md-2 webdesign illustrator">';
          html +='<div class="gal-detail thumb">';
          html +='<a href="'+imgurl+'" class="image-popup" title="Screenshot-1" target="_blank">';
          html += '<img src="'+imgurl+'" class="thumb-img" alt="work-thumbnail" >';
          html +='</a>';
          html +='<a class="btn btn-sm btn-danger m-t-10" href="'+delUrl+'" data-method="delete"  data-token="{{csrf_token()}}" data-confirm="确定删除吗?"><span class="btn-label">  <i class="md md-close"></i></span>删除</a>';
          html +='</div></div>';  
          $(html).appendTo('.portfolioContainer');
      }
     
        </script>
@endsection